<!DOCTYPE html>
<html>
<head>
<title>CSS的基本语法</title>

<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">

<style type="text/css">
.p1,.p2,#id3 {
	color: #CC33FF;
	font-size: 20px;
}

#id1,#id2,.p3 {
	color: #FF0000;
	font-size: 40px;
}
/*这里当两个相同的类名时,注意要写上标签*/
p.special,h1.special {
	color: #00FF00;
	font-size: 60px;
}

p {
	color: #660000;
}

p strong {
	color: #1E14D6;
}

p b {
	color: #FF6699;
}

span {
	font-size: 50px;
	font-family: "黑体";
	float: left;
	padding: 8px 5px auto 10px;
}
</style>
</head>
<body>
	<h1 id="id1">CSS选择器-集体声明id1</h1>
	<h1 id="id2">CSS选择器-集体声明id2</h1>
	<h1 id="id3">CSS选择器-集体声明id3</h1>
	<h1 class="special">h1 CSS选择器-集体声明special</h1>
	<p class="p1">CSS选择器-集体声明p1</p>
	<p class="p2">CSS选择器-集体声明p2</p>
	<p class="p3">CSS选择器-集体声明p3</p>
	<p class="special">p CSS选择器-集体声明special</p>
	<p>
		CSS选择器-<strong>集体声明</strong>p4
	</p>
	<p>CSS选择器-集体声明p5</p>
	<br />
	<!-- 选择器的嵌套  -->
	<p>
		CSS选择器-选择器的<b>嵌套</b>
	</p>
	<b>这里不会被更改颜色</b>
	<p>
		<span>首</span>字下沉测试<br />增加下一行<br />增加下一行<br />增加下一行
	</p>

	<!-- 表格的单元格的合并 -->
	<table width="210" height="154" border="1">
		<tr>
			<th colspan="2"></th>
			<th rowspan="2" scope="col"></th>
		</tr>
		<tr>
			<td rowspan="2"></td>
			<td></td>
		</tr>
		<tr>
			<td colspan="2"></td>
		</tr>
	</table>
	
</body>

</html>
